<%--
  Created by IntelliJ IDEA.
  User: 陈坤
  Date: 2024/4/26
  Time: 15:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
    <title>Title</title>
</head>
<style>
    body {
        background: url('https://cdn.pixabay.com/photo/2018/08/14/13/23/ocean-3605547_1280.jpg') no-repeat;
        background-size: 100% 130%;
    }

    #login_box {
        width: 20%;
        height: 400px;
        background-color: #00000060;
        margin: 10% auto auto;
        text-align: center;
        border-radius: 10px;
        padding: 50px 50px;
    }

    h2 {
        color: #ffffff90;
        margin-top: 5%;
    }


    span {
        color: #fff;
    }

    input {
        border: 0;
        width: 60%;
        font-size: 15px;
        color: #fff;
        background: transparent;
        border-bottom: 2px solid #fff;
        padding: 5px 10px;
        outline: none;
        margin-top: 10px;
    }

    button {
        margin-top: 50px;
        width: 60%;
        height: 30px;
        border-radius: 10px;
        border: 0;
        color: #fff;
        text-align: center;
        line-height: 30px;
        font-size: 15px;
        background-image: linear-gradient(to right, #30cfd0, #330867);
    }

    a {
        color: #b94648;
    }
</style>

<body>
<div id="login_box">
    <h2>LOGIN</h2>
    <form>
        <div id="input_box">
            <label>
                <input type="text" placeholder="请输入用户名">
            </label>
        </div>
        <div class="input_box">
            <label>
                <input type="password" placeholder="请输入密码">
            </label>
        </div>
        <button>登录</button><br>
    </form>
</div>
</body>
</html>
